<template>
  <div class="home-category">
    <div
      class="home-category-container"
      v-for="item in categoryList"
      :key="item.id"
    >
      <div class="title">{{ item.name }}</div>
      <product :goodsList="item.goodsList"></product>
    </div>
  </div>
</template>
 
<script>
import product from "@/components/product/product.vue";

export default {
  name: "",
  props: ["categoryList"],
  components: {
    product,
  },
};
</script>
 
<style lang="less" scoped>
.home-category {
  .home-category-container {
    margin-top: 0.2rem;
  }
  .title {
    height: 0.4rem;
    line-height: 0.4rem;
    text-align: center;
    background: #fff;
  }
}
</style>